<template>
	<el-dialog title="评论对话框" v-model="visible" customClass="customWidth" destroy-on-close @closed="$emit('closed')">
		<el-form :model="form" :rules="rules" :disabled="mode=='show'" ref="dialogForm" label-width="100px" label-position="left">
			<h3>{{form.title}}</h3>
			<div style="margin: 10px;">
				{{form.content}}
			</div>
			<div v-if="form.attachId!=undefined && form.attachId!=''">
				<el-image v-for="img in form.attachId.split(',')" :src="img" style="height: 100px;width: 100px;margin: 10px 5px 10px 5px"
						  fit="cover" :preview-src-list="form.attachId.split(',')"></el-image>
			</div>
			<div v-for="item in commList" style="margin: 10px">
				<span>{{item.comment}}</span>
				<div style="margin-top:10px;">
					<div style="display: contents;">
						<el-avatar :src="item.avatar" size="small"></el-avatar>
					</div>
					<div style="position: relative;top: -5px;display: inline-block;">
						<span style="margin-left: 15px">{{ item.createUserName }}</span>
						<span style="float: right;padding-left:10px">
										<el-icon><el-icon-clock/></el-icon>{{showtime(item.createTime)}}
									</span>
					</div>
					<div style="float: right;margin-bottom: 10px">
						<el-button type="text" @click="deleteRecord(item)" v-if="item.createUser==accountId">删除</el-button>
					</div>
				</div>
			</div>
			<div>
				<el-input v-model="form.comment" placeholder="我的评论" clearable type="textarea" style="height: 100px"></el-input>
			</div>
		</el-form>
		<template #footer>
			<el-button @click="visible=false">取 消</el-button>
			<el-button type="primary" :loading="isSaveing" @click="submit()">确 定</el-button>
		</template>
	</el-dialog>

</template>
<script>
export default {
	emits: ['success', 'closed'],
	components: {
	},
	data() {
		return {
			dialog: {
				isShow: false
			},
			commList:[],
			accountId:'',
			visible: false,
			isSaveing: false,
			isShowMsg: false,
			form: {
				recordId: '',
				title: '',
				content: '',
				attachId: "",
				comment:'',
			},
		}
	},
	mounted() {
		this.accountId = this.$TOOL.data.get('USER_INFO').accountId;
	},
	methods: {
		//显示
		open() {
			this.visible = true;
			return this
		},
		async getDynamicsCommentList(recordId){
			var res = await this.$API.info.dynamics.getDynamicsCommentList.get({parentId:recordId});
			if (res.code == 200) {
				this.commList = res.data;
			}
		},
		async deleteRecord(item)
		{
			var res = await this.$API.info.dynamics.deleteDynamicsComment.post({recordId:item.recordId});
			if (res.code == 200) {
				this.$message.success("操作成功");
				this.getDynamicsCommentList(item.parentId);
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		},
		submit() {
			this.$refs.dialogForm.validate(async (valid) => {
				if (valid) {
					this.isSaveing = true;
					var res = await this.$API.info.dynamics.insertDynamicsComment.post({parentId:this.form.recordId,comment:this.form.comment});
					this.isSaveing = false;
					if (res.code == 200) {
						this.$emit('success')
						this.$message.success("操作成功")
					} else {
						this.$alert(res.message, "提示", {type: 'error'})
					}
					this.visible = false;
				}
			})
		},
		setData(data) {
			this.form.recordId = data.recordId
			this.form.title = data.title
			this.form.content = data.content
			this.form.attachId = data.attachId
			this.getDynamicsCommentList(data.recordId);
		},
		showtime(time) {
			let date =
				typeof time === "number"
					? new Date(time)
					: new Date((time || "").replace(/-/g, "/"));
			let diff = (new Date().getTime() - date.getTime()) / 1000;
			let dayDiff = Math.floor(diff / 86400);

			let isValidDate =
				Object.prototype.toString.call(date) === "[object Date]" &&
				!isNaN(date.getTime());

			if (!isValidDate) {
				window.console.error("不是有效日期格式");
			}
			const formatDate = function(date) {
				let today = new Date(date);
				let year = today.getFullYear();
				let month = ("0" + (today.getMonth() + 1)).slice(-2);
				let day = ("0" + today.getDate()).slice(-2);
				let hour = today.getHours();
				let minute = today.getMinutes();
				let second = today.getSeconds();
				return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
			};

			if (isNaN(dayDiff) || dayDiff < 0 || dayDiff >= 31) {
				return formatDate(date);
			}
			return (
				(dayDiff === 0 &&
					((diff < 60 && "刚刚") ||
						(diff < 120 && "1分钟前") ||
						(diff < 3600 && Math.floor(diff / 60) + "分钟前") ||
						(diff < 7200 && "1小时前") ||
						(diff < 86400 && Math.floor(diff / 3600) + "小时前"))) ||
				(dayDiff === 1 && "昨天") ||
				(dayDiff < 7 && dayDiff + "天前") ||
				(dayDiff < 31 && Math.ceil(dayDiff / 7) + "周前")
			);
		},
	}
}
</script>

<style>
.customWidth {
	width: 60%;
}
</style>
